extends layout

block content
    h1.my-3= title
    .row
        .col-12.col-md-8
            .card.mt-2#image-card(data-id=image._id)
                .card-header.bg-primary 图片展示
                .card-body
                    img.card-img-top(src='/uploads/'+image.filename)
                .card-footer
                    .form-group.row
                        .col-12.col-md-8
                            button.btn.btn-success.mr-2#like-btn
                                i.fa.fa-heart.mr-1
                                | like
                            strong#span-likes=image.likes
                            strong.mx-3 -
                            i.fa.fa-eye.mr-1
                            strong=image.views
                            strong.mx-2 -
                            span.mx-1 
                                | Posted: #{createdFromNow} 
                        .col-12.col-md-4.text-right
                            button.btn.btn-danger#del-btn 
                                i.fa.fa-times
            .card.mt-2
                .card-header 添加评论
                .card-body 
                    form(action="/comment",method="post")
                        .form-group.row
                            .col-12.col-md-3
                                label.col-form-label Name
                            .col-12.col-md-9
                                input.form-control(type='text', name='name')
                                input(type="hidden",name="imageid", value=image.id)
                        .form-group.row
                            .col-12.col-md-3
                                label.col-form-label Email
                            .col-12.col-md-9
                                input.form-control(type='email', name='email')
                        .form-group.row
                            .col-12.col-md-3
                                label.col-form-label Comment
                            .col-z12.col-md-9
                                textarea.form-control(name='comments', rows='3')
                        .form-group.row
                            .col-12.text-right
                                button.btn.btn-success(type='submit')
                                    | 提交评论
                                
            .card.mt-2
                .card-header 评论
                .card-body 
                each comment in comments
                    .col-12.col-md-18.mt-2
                        .col-12.col-md-12 Name: #{comment.name}
                                                                
                        .col-12.col-md-12 Email: #{comment.email}

                        .col-12.col-md-12 info: #{comment.comment}
        .col-12.col-md-4
            .card.mt-2
                .card-header 统计信息
                .card-body 
                    
                        
                    .col-12.col-md-6 Images: #{imageAll}
                                                            
                    .col-12.col-md-6 Comments: #{commentAll}
                
                    .col-12.col-md-6 Views: #{views}
                
                    .col-12.col-md-6 Likes: #{image.likes}               
            .card.mt-2
                .card-header 最受欢迎
                .card-body 最受欢迎图片
                 .row
                  each image in images
                   .col-12.col-md-4.mt-2
                     a(href='/image/' + image._id)
                      .card
                       img.card-img-top(src='/uploads/' + image.filename)               
            .card.mt-2
                .card-header 最近评论
                .card-body 最近评论
                 .row
                  each comment in commentMore
                    .col-12.col-md-18.mt-2
                        .col-12.col-md-12 Name: #{comment.name}
                                                                
                        .col-12.col-md-12 Email: #{comment.email}

                        .col-12.col-md-12 info: #{comment.comment}
                    
                        
                                    
    script(src="../javascripts/actions.js")
    include footer.pug
